import Taro, { Component } from '@tarojs/taro'
import { View, Text, Picker,Image ,Input} from '@tarojs/components'
import {AtTag} from 'taro-ui'
import './receivecoupon.css'
import yq from '../../img/youhuiquan3.png'
import nyq from '../../img/youhuiquan4.png'
import by from '../../img/banyuan.png'
import right from '../../img/right.png'
import yinzhang from '../../img/yinzhang.png'
import app from '../../main';


export default class receivecoupon extends Component {

  config = {
    navigationBarTitleText: '领取优惠券'
  }
  constructor () { 
    super(...arguments);
    this.state = {
       couponslist:[]    //优惠券数量
    }
  }
   
  offset = 0
  length = 20
  
  //优惠券列表
  getCouponsList () {
    let me = this
    let list = []
    let data = {offset:this.offset,length:this.length}
    app.post('web/coupon/getCouponsList', data, (res)=>{
       list = res.data.result.result
       me.setState({
         couponslist:list
       })
    })
  }

  //获取优惠券
  receiveCoupon (couponid) {
    console.log(couponid)
    let me = this
    let data = {coupon_id:couponid}
    app.post('web/coupon/receiveCoupon', data, (res)=>{
      console.log('领取成功')
    })
  }

  componentDidMount () {
    this.getCouponsList()
  }

  render () {

    let couponlist = this.state.couponslist.map((item)=>{
       return (item.status == '已领取' 
              ? <View className="myCoopno">          
                     <View className="card2">
                        <Image className='card-by' src={by}/>
                        <View className="card-info">
                            {item.coupon_type == "满减"
                            ?   <Text className='card-info1'>￥{parseFloat(item.discount.toString())}</Text>
                            :   <Text className='card-info1'>{parseFloat(item.discount.toString())}折</Text>
                            }
                            <Text className='card-info2'>满{parseFloat(item.full_money.toString())}元可用</Text>
                        </View>
                        <Image className='card-yq' src={nyq}/>
                     </View>
                    <View className='content-yingzhang'>
                        <View><Image style='height:60px; width:60px;' src={yinzhang}/></View>
                        <View className='yingzhangTitle'><Text>已领取</Text></View>
                    </View>
                   </View>
                 : <View className="myCoopn">          
                     <View className="card">
                        <Image className='card-by' src={by}/>
                        <View className="card-info">
                            {item.coupon_type == "满减"
                            ?   <Text className='card-info1'>￥{parseFloat(item.discount.toString())}</Text>
                            :   <Text className='card-info1'>{parseFloat(item.discount.toString())}折</Text>
                            }
                            <Text className='card-info2'>满{parseFloat(item.full_money.toString())}元可用</Text>
                        </View>
                        <Image className='card-yq' src={yq}/>
                     </View>
                     <View className='card-content'>
                            <View className='text-and-tag' onClick={this.receiveCoupon.bind(this,item.id)}>
                                <Text className='nowplay'>立即领取</Text>
                            </View>      
                     </View>
                   </View>)
    })

    return (
       <View>
           {couponlist}
       </View>
    )
  }
}
